<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:insert="~{include :: header('机构列表')}" />
    <th:block th:insert="~{include :: bootstrap-table-css}" />
</head>
<body class="hold-transition">
<div class="container-fluid mt-2 mb-2">
    <div class="row">
        <div class="col-sm-12">
            <form id="formId">
                <div class="form-group form-inline m-0">
                    <label class="mr-1">名称</label>
                    <input type="text" class="form-control mr-1" name="companyName"/>
                    <label class="mr-1">域名</label>
                    <input type="text" class="form-control mr-1" name="siteDomain"/>
                    <label class="mr-1">联系人</label>
                    <input type="text" class="form-control mr-1" name="linkName"/>
                    <label class="mr-1">电话</label>
                    <input type="text" class="form-control mr-1" name="linkMobile"/>
                    <a class="btn btn-primary btn-rounded mr-1" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                    <a class="btn btn-warning btn-rounded" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                </div>
            </form>
        </div>
        <div class="btn-group" id="toolbar" role="group">
            <a class="btn btn-success" onclick="addCompany()">
                <i class="fa fa-plus"></i> 添加机构
            </a>
        </div>
        <div class="col-sm-12 select-table table-striped">
            <table id="bootstrap-table" class="table-striped"></table>
        </div>
    </div>
</div>
<th:block th:insert="~{include :: footer}" />
<th:block th:insert="~{include :: bootstrap-table-js}" />
<script th:inline="javascript">
    var editFlag = [[${@permission.hasPermi('company:edit')}]];
    var removeFlag = [[${@permission.hasPermi('company:remove')}]];
    var prefix = "/company";
    $(function() {
        var options = {
            showSearch: false,
            showRefresh: true,
            showToggle: true,
            showColumns: false,
            url: prefix + "/list.json",
            modalName: "基本设置",
            onExpandRow: function (index, row, $detail) {
                if (row.parentId > 0) return false;
                initChildTable(index, row, $detail);
            },
            detailView: true,
            columns: [
                {
                    field: 'companyId',
                    align: 'center',
                    title: '机构ID',
                    width: 80
                },
                {
                    field: 'companyName',
                    title: '机构名称'
                },
                {
                    field: 'siteDomain',
                    title: '网站域名',
                    width: 180
                },
                {
                    field: 'linkName',
                    title: '联系人名称',
                    width: 100
                },
                {
                    field: 'linkMobile',
                    title: '联系电话',
                    width: 120
                },
                {
                    field: 'isDisabled',
                    title: '是否启用',
                    width: 80,
                    formatter: function (value, row, index) {
                        return statusTools(row);
                    }
                },
                {
                    field: 'expireDate',
                    title: '过期时间',
                    width: 120,
                    formatter: function (value, row, index) {
                        var timestamp = new Date(value).getTime();
                        var timecurrent = Date.parse(new Date());
                        if (timecurrent < timestamp) {
                            return value;
                        } else {
                            return value + " <span style='color:red;'> (已过期)</span>";
                        }
                    }
                },
                {
                    title: '操作',
                    align: 'center',
                    width: 150,
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="editCompany(\'' + row.companyId + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                        actions.push('<a class="btn btn-info btn-xs" href="javascript:void(0)" onclick="accountInfo(\'' + row.companyId + '\')"><i class="fa fa-search"></i>账户</a> ');
                        return actions.join('');
                    }
                }]
        };
        $.table.init(options);
    });

    initChildTable = function(index, row, $detail) {
        var childTable = $detail.html('<table style="table-layout:fixed"></table>').find('table');
        $(childTable).bootstrapTable({
            url: prefix + "/list.json",
            method: 'post',
            sidePagination: "server",
            contentType: "application/x-www-form-urlencoded",
            queryParams: {
                parentId: row.companyId
            },
            columns: [
                {
                    field: 'companyId',
                    align: 'center',
                    title: '机构ID',
                    width: 100
                },
                {
                    field: 'companyName',
                    title: '机构名称'
                },
                {
                    field: 'siteDomain',
                    title: '网站域名'
                },
                {
                    field: 'linkName',
                    title: '联系人名称'
                },
                {
                    field: 'linkMobile',
                    title: '联系人电话'
                },
                {
                    field: 'isDisabled',
                    title: '状态',
                    width: 80,
                    formatter: function (value, row, index) {
                        if (value === 0) {
                            return '<span class="badge badge-primary">正常</span>'
                        } else {
                            return '<span class="badge badge-danger">禁用</span>'
                        }
                    }
                },
                {
                    field: 'expireDate',
                    title: '过期时间',
                    formatter: function (value, row, index) {
                        var timestamp = new Date(value).getTime();
                        var timecurrent = Date.parse(new Date());
                        if (timecurrent < timestamp) {
                            return value;
                        } else {
                            return value + " <span style='color:red;'> (已过期)</span>";
                        }
                    }
                }]
        });
    };

    /* 状态显示 */
    function statusTools(row) {
        if (row.isDisabled === 1) {
            return '<i class=\"fa fa-toggle-off text-info fa-2x\" onclick="disabledCompany(\'' + row.companyId + '\',\'' + 0 + '\')"></i> ';
        } else {
            return '<i class=\"fa fa-toggle-on text-info fa-2x\" onclick="disabledCompany(\'' + row.companyId + '\',\'' + 1 + '\')"></i> ';
        }
    }

    function disabledCompany(id,disabled){
        table.set();
        var str ="";
        if(disabled===0){
            str = "确定要启用该机构吗？"
        }else{
            str = "确定要禁用该机构吗？"
        }
        $.modal.confirm(str, function() {
            var data = {"companyId":id,"isDisabled": disabled };
            $.operate.submit(prefix+"/disabled.json", "post", "json", data);
        });
    }

    //详情页
    function accountInfo(companyId) {
        var index = layer.open({
            title: '机构账户详情',
            type: 2,
            shade: 0.2,
            shadeClose: true,
            area: ['80%', '90%'],
            content: '/company/account/info.html?companyId='+companyId
        });
    }

    function addCompany(){
        var index = layer.open({
            title: '添加机构',
            type: 2,
            shade: 0.2,
            shadeClose: true,
            area: ['80%', '90%'],
            content: '/company/edit/0'
        });
    }

    function editCompany(companyId){
        var index = layer.open({
            title: '修改机构信息',
            type: 2,
            shade: 0.2,
            shadeClose: true,
            area: ['80%', '90%'],
            content: '/company/edit/'+companyId
        });
    }
</script>
</body>
</html>